<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/component/common.jsp" %>
<layout:override name="${pageHead}">
    <!-- DataTables CSS -->
    <link href="${css}/dataTables.bootstrap3.css" rel="stylesheet">
    <!-- DataTables Responsive CSS -->
    <link href="${css}/dataTables.responsive.css" rel="stylesheet">
</layout:override>
<layout:override name="${pageContents}">
        <div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">Tables</h1>
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <input type="button" value="新增医院" onclick="javascript:window.location.href='${ctx}/hosp/toAdd'" />
                    </div>
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <div class="dataTable_wrapper">
                            <table class="table table-striped table-bordered table-hover" id="dataTables-example">
                                <thead>
                                <tr>
                                    <th>医院名称</th>
                                    <th>医院级别</th>
                                    <th>医院所在地</th>
                                    <th>Engine version</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <c:forEach items="${hospitals.content}" var="hosp" varStatus="status">
                                    <tr class="${status.index %2 == 1 ? 'odd':'even'}">
                                        <td>${hosp.hospName}</td>
                                        <td>${hosp.hospLevelName}</td>
                                        <td>${hosp.areaName}</td>
                                        <td class="center">4</td>
                                        <td class="center">
                                            <button class="btn btn-primary btn-sm">详细信息</button>
                                            <button class="btn btn-danger btn-sm">删除</button>
                                        </td>
                                    </tr>
                                </c:forEach>
                                </tbody>
                            </table>
                        </div>
                        <!-- /.table-responsive -->
                        <ul id="pagination" class="pagination-sm"></ul>
                    </div>
                    <!-- /.panel-body -->
                </div>
                <!-- /.panel -->
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->
    <!-- /#page-wrapper -->
</layout:override>
<layout:override name="${pageScript}">
    <!-- DataTables JavaScript -->
    <%--<script src="${js}/jquery.dataTables.min.js"></script>--%>
    <script src="${js}/jquery.twbsPagination.min.js"></script>
    <%--<script src="${js}/dataTables.bootstrap3.min.js"></script>--%>
    <script>
        $('#pagination').twbsPagination({
            totalPages: ${hospitals.totalPages},
            startPage: ${hospitals.number} + 1,
            visiblePages: 7,
            first: '首页',
            last: '末页',
            prev: '上一页',
            next: '下一页',
            onPageClick: function (event, page) {
                $('#page-content').text('Page ' + page);
            }
        });
    </script>
</layout:override>
<%@ include file="/WEB-INF/jsp/admin/layout_admin.jsp" %>